<?php 
include("files/php/global.php"); 
printHeader();

?>


            <head> 

<link rel="stylesheet" type="text/css" href="./style/button.css" />

            <script type="text/javascript" src="./files/js/jquery.tools.min.js"></script>

            <!-- wrapper, inputs and labels  -->
            <link rel="stylesheet" type="text/css" href="style/flight.css"/>

            <!-- calendar styling -->
            <link rel="stylesheet" type="text/css" href="style/flight-calendar.css"/>
            <script type="text/javascript" src="./files/js/alarm_ajax.js"></script>
           
        <style>
	

	.facebox {

		/* overlay is hidden before loading */
		display:none;

		/* standard decorations */
		width:400px;
		border:10px solid #666;

		/* for modern browsers use semi-transparent color on the border. nice! */
		border:10px solid rgba(82, 82, 82, 0.698);

		/* hot CSS3 features for mozilla and webkit-based browsers (rounded borders) */
		-moz-border-radius:8px;
		-webkit-border-radius:8px;
	}

	.facebox div {
		padding:10px;
		border:1px solid #3B5998;
		background-color:#fff;
		font-family:"lucida grande",tahoma,verdana,arial,sans-serif
	}

	.facebox h2 {
		margin:-11px;
		margin-bottom:0px;
		color:#fff;
		background-color:#6D84B4;
		padding:5px 10px;
		border:1px solid #3B5998;
		font-size:20px;
	}
        
        #DivBotton{
            margin-top: -31px;
            margin-left: 105px;
        }
	</style>
        
            <script type="text/javascript">
			var showBotton=false;
                        var startData="";
                        var endData="";
                        var selected_par = new Array();
                        var selected = new Array();
                        
//            function alertStyle()
//            {
//                alert('cdcdcd');
                                // select the overlay element - and "make it an overlay"

$("#inserireSez").overlay({ // custom top position
                        top: 60,
                        // some mask tweaks suitable for facebox-looking dialogs
                        mask: {
                                // you might also consider a "transparent" color for the mask
                                color: '#fff',
                                // load mask a little faster
                                loadSpeed: 200,
                                // very transparent
                                opacity: 0.5
                        },
                        // disable this for modal dialog-type of overlays
                        closeOnClick: false,
                        // load it immediately after the construction
                        load: false
                });

$("#nessunaRiga").overlay({ // custom top position
                        top: 60,
                        // some mask tweaks suitable for facebox-looking dialogs
                        mask: {
                                // you might also consider a "transparent" color for the mask
                                color: '#fff',
                                // load mask a little faster
                                loadSpeed: 200,
                                // very transparent
                                opacity: 0.5
                        },
                        // disable this for modal dialog-type of overlays
                        closeOnClick: false,
                        // load it immediately after the construction
                        load: false
                });

               
            //}
            
            function makeArchivioFile()
            {
                window.open ("./files/php/vistaDati.php?dataS="+startData+"&dataE="+endData+"&sezioni="+selected_par+"&makeFile=true", "Archivio","width=350,height=250");
            }

            function selectCkeck(val,ob)
            {
               
               if(ob.checked)
                   selected[val]=val;
               else
                   selected[val]=-1;
               
                   
            }
            
                    function addBotton() {
			
			//Create an input type dynamically.
			var element = document.createElement("input");
		     
			//Assign different attributes to the element.
			element.setAttribute("type", "button");
			element.setAttribute("value","download");
			element.setAttribute("name", "Downalod Dati");
                        element.setAttribute("onclick", "makeArchivioFile();");
                        element.setAttribute("style", "margin: 0px 0 0 8px;");
                        element.setAttribute("class", "buttonview");
                        
                        
			var foo = document.getElementById("DivBotton");
		     
			//Append the element in page (in span).
			foo.appendChild(element);
                        showBotton = true;
		     
		    }
                   
                    
                    
                    function openWin()
                    {
                     
                      startData=$(":date:first").data("dateinput").getValue('dd/mm/yyyy')+" 00:00";
                      endData=($(":date:last").data("dateinput") != null)?$(":date:last").data("dateinput").getValue('dd/mm/yyyy')+" 00:00" : endData;
                      
                      
                     
                      for (i=1; i<=selected.length;i++)
                      {
                        if (selected[i] > -1)
                        {
                            selected_par[i-1]=selected[i];
                        }
                        else if (selected[i] == -1)
                            selected_par.pop();
                            
                      }
                      if(selected_par.length == 0)
                      {
                            var api = $("#inserireSez").overlay({api:true});
                            api.load();
                            
                            return;
                            
                      }
                      ret=getData_Over("files/php/vistaDati.php?dataS="+startData+"&dataE="+endData+"&sezioni="+selected_par,'showTab',true);

                      if(document.getElementById('myTable') == null)
                      {
                            var api = $("#nessunaRiga").overlay({api:true});
                            api.load(); 
                      }
                      else if(true == ret)
                      {        
                            loadFileJsArchivio();                  
                            sez=selected_par;
                            if (!showBotton) 
                            	   addBotton();                            
		      }
                      
                    }
                    
                    
            </script>

                   <style type="text/css">
            ul#jqmultiselect {
            border: 2px solid #B5B8C8;
            height: 70px;
            list-style: none outside none;
            overflow-x: hidden;
            overflow-y: auto;
            padding: 0;
            width: 515px;
            background-color: #ffffff;
            }
            #jqmultiselect li label {
            color: #000000;
            display: block;
            outline: medium none;
            padding: 4px 4px 4px 26px;
            position: relative;
            }
            #jqmultiselect li label:hover {
            background-color: #b1a9a9;
            color: #000000;
            }
            #jqmultiselect li label.selected {
            background-color: #d0cece;
            color: #9A9191;
            }
            #jqmultiselect li label .checkbox {
            left: 2px;
            position: absolute;
            top: 2px;
            }
        </style>  
         <script type="text/javascript">
             
                $(document).ready(function() {
                // se il checkbox è selezionato coloro la label per simulare la colorazione delle select
                $('#jqmultiselect label').each(function() {
                if ($(this).find(':checkbox').attr('checked')) 
                    $(this).addClass('selected');
                });
                // al click sul checkbox metto/tolgo la classe 'selected'
                $('#jqmultiselect :checkbox').click(function(e) {
                var checked = $(this).attr('checked');
                $(this).closest('label').toggleClass('selected', checked);
                });
                });
        </script>
	</head> 
	<body>
            
                         
            <form id="flight" action="javascript:void(0);">
                <table>
                <tr>
                    <td>
                     <label> 
                        Start Data 
                        <input type="date" name="dataS" max="0" value="-1" id="dataS"/> 
                    </label>   
                    
                        <label> 
                        End Data 
                        <input type="date" name="dataE" max="1" min="-1" value="1" id="dataE"/> 
                    </label>
                    </td>
                </tr>
                <tr>
                    <td>
                        <ul id="jqmultiselect">
                            <?php
                                    for($i=1;$i<=15;$i++)
                                    {
                                        print("<li><label id=\"$i\">");

                                        print('<input type="checkbox" name="Sezione[]" id="cinema" value="'.$i.'" class="checkbox" onclick="javascript:selectCkeck('.$i.',this);"/>');


                                        print("Sezione $i</label></li>");
                                    //        echo "<option value=\"$i\">Sezione $i</option>";
                                    }
                                    print("<li><label id=\"16\">");

                                    print('<input type="checkbox" name="Sezione[]" id="cinema" value="16" class="checkbox" onclick="javascript:selectCkeck(16,this);"/>');

                                    print("Sezione Rasponi</label></li>");
                                    
                            ?>
                            </ul> 
                    </td>
                </tr>
                </table>
          		
		        <button type="submit" name="mySubmit" id="submit" value="Visualizza" style="margin: 0px 0 0 8px;" class="buttonview" onClick="javascript:openWin();"/> 
                         <span id="msgbox" style="display:none"></span >Visualizza</button>						
                        <div id="DivBotton">

                        </div>
			</form>
               
            <div id="showTab" style="width:150;height:300;overflow:auto">  </div> 
            <div id="showMakeFile">  </div> 
            <!-- facebook dialog -->

            <div id="inserireSez" class="facebox">

                    <div>
                            <h2>Error</h2>

                            <p>
                                    Inserire almeno una sezione tra quelle elencate
                            </p>


                            <!-- yes/no buttons -->
                            <p>
                                    <button class="close"> Chiudi </button>

                            </p>
                    </div>

            </div>
            <div id="nessunaRiga" class="facebox">

                    <div>
                            <h2>Error</h2>

                            <p>
                                    Non sono presenti dati per le date selezionate
                            </p>


                            <!-- yes/no buttons -->
                            <p>
                                    <button class="close"> Chiudi </button>

                            </p>
                    </div>

            </div>
 <script>
// the french localization
$.tools.dateinput.localize("it",  {
   months:        'Gennaio,Febbraio,Marzo,Aprile,Maggio,Giugno,Luglio,Agosto,Settembre,Ottobre,Novembre,Dicembre',
   shortMonths:   'Gen,Feb,Mar,Apr,Mag,Giu,Lug,Ago,Set,Ott,Nov,Dic',
   days:          'domenica,lened&igrave;,marted&igrave;,mercoled&igrave;,venerd&igrave;,sabato',
   shortDays:     'dom,lun,mar,mer,gio,ven,sab'
});

$(":date").dateinput({ lang:'it', trigger: true, format: 'dd mmmm yyyy'});
//$(":date:last").dateinput({ lang:'it', trigger: true, format: 'dd mmmm yyyy', min: -1 });


     
// use the same callback for two different events. possible with bind
$(":date").bind("onShow onHide", function()  {
	$(this).parent().toggleClass("active"); 
});


// when first date input is changed
$(":date:first").data("dateinput").change(function() {
	var myDate=this.getValue();
	
	//end data parte dal giorno dopo quello selezionato fino a massimo 180 giorni
	var today=new Date();
	var sup=new Date(myDate);
	sup.setDate(sup.getDate()+360);
	sup=(sup > today)?today:sup;
	
	var inf=new Date(myDate);
	inf.setDate(inf.getDate()+1);
	
	$(":date#dataE").data("dateinput").setMax(sup, true);
	$(":date#dataE").data("dateinput").setMin(inf, true);
        
});
				</script>
	</body> 
            </html>
